<template>
    <div id="headerTop">
		<div class="head_top">
			<div class="head_top_cont">
				<p class="hright">
					<b><i class="iconfont">&#xe616;</i>400-816-2283</b>
					<a href="login.html">登录</a>
					<a href="regist.html">立即注册</a>
				</p>
				<p>
					<a href=""><i class="iconfont">&#xe602;</i>官方微信</a>
					<a href=""><i class="iconfont">&#xe601;</i>官方微博</a>
					<a href=""><i class="iconfont">&#xe623;</i>在线客服</a>
				</p>
			</div>
		</div>
    </div>
</template>

<script>
    export default {
        name: 'headerTop'
    };
</script>

<style lang="less" rel="stylesheet/less" type="text/css">
	@import '../../public/css/variable.less'; 
    .head_top{
        .cf();
        background: #191f25;
        .fonts(12px);
        line-height: 40px;
        
        .head_top_cont{
            width: 1200px;
            margin: 0 auto;
        }
        a{
            color: @cw;
            padding: 0 30px 0 0;
            i{ 
                display: inline-block; 
                padding-right: 5px; 
                vertical-align: middle;
            }
            &:hover{
                color: @cgolden;
            }
        }
        p{
            height: 40px;
            overflow: hidden;
            line-height: 40px;
        }
        .hright{
            float: right;
            b{
                .fonts(16px);
                color: @cgolden;
                padding-right: 10px;
                i{
                    font-weight: normal;
                    padding-right: 5px;
                    .fonts(12px);
                    color: #585043;
                }
            }
            a{
                display: inline-block;
                padding: 0 30px;
                height: 100%;
                &:hover{
                    color: @cw;
                    background: @cgolden;
                }
            }
        }
    }
</style>